Esta pregunta es más genérica. Estoy empezando con la programación de objetos y me estoy perdiendo rápidamente. Está funcionando, pero siento que solo tengo suerte porque mi código no está limpio ... y no será escalable.

1. ¿Puedo dejar this.rgb en la función de construcción del reproductor sin definirlo de inmediato? ¿Sería más limpio crear una "función rgb" que calcule el valor ( this.rgb = rgb )
2. ¿Es repugnante definir la variable rgb dentro de la función newButton (que se supone que se trata de otra cosa)?
3. ¿Realmente tengo que hacer esto? this.newButton = newButton; ( como se ve en CDN ) o hay una forma más simple/más limpia?
4. Bonificación: leí las explicaciones de Mike y Marks en las plantillas , pero siento que puedo hacer las cosas más rápido (y más sucias) con esta cadena muy larga que define el button ... ¿Qué tan sucia es?

 /*------------------------------------------ Player definition -------------------------------------------*/ function newButton() { r = Math.floor(Math.random() * 100 + 100) g = Math.floor(Math.random() * 100 + 100) b = Math.floor(Math.random() * 100 + 100) this.rgb = "rgb(" + r + "," + g + "," + b + ")"; return button = `<button onclick="playerTimer(${this.playerNumber})" class="btn" style="background-color:${this.rgb}"><h3>Player ${this.playerNumber+1} </h3> <br><br> Time left:<h2><div id="playerTimerDiv${this.playerNumber}"> 30 </div></h2></button>`; } function Player(playerNumber, timeout, sec) { this.playerNumber = playerNumber; this.rgb this.timeout = timeout; this.sec =sec; this.div = document.createElement("div"); this.newButton = newButton; }

Muchas gracias de antemano por tu ayuda ! Perdón por esta pregunta tan larga....

Saludos,